import React,{useEffect,useState} from 'react'
import {Route} from 'react-router-dom'
import Styles from './index.module.less'
import {getParams} from '../../../utils/getParams'
import {welcome} from '../../../service/index'
 const SelectPeople=(props)=> {
const [active, setactive] = useState(0)
const [TableNum, setTableNum] = useState(0)
const submit = ()=>{
    let data = {
        UserId:getParams('userId'),
        shopId:getParams('shopId'),
        tableNum:getParams('tableNum'),
        people:active
    }
    welcome.addPeoples(data).then(data=>{
        // console.log(data)
        alert('提交成功','success',1000)
        setTimeout(()=>{
            props.history.push("/project/list")
        },1000)
     
    })
}
     useEffect(() => {
        setTableNum(getParams('tableNum'))
     
     }, [])

    return (
        <div className={Styles.SelectPeople}>
            <h3>{TableNum}号</h3>
            <div>用餐人数</div>
            <span>请选择正确的用餐人数</span>
            <ul>
                {
                    [...new Array(8)].map((item,index)=>{
                    return <li className={active===index+1?Styles.active:''} key={index} onClick={()=>setactive(index+1)}>{index+1}</li>
                    })
                }
            </ul>
            <p className={Styles.btn} onClick={submit}>开始点餐</p>
        </div>
    )
}
const RenderRoute = ()=>{
    return <Route path="/welcome/selectPeople"  component={SelectPeople} />
}
export default RenderRoute
